<template>
    <addEditSubjectView ref="addEditSubjectView"/>
    <div class="app-table">
        <div class="app-body">
            <div class="app-search">
                <el-form :inline="true" class="demo-form-inline" v-model="form">
                    <el-form-item>
                        <el-button type="success" @click="add">添加学科</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <el-table size="small" :data="list" border :row-class-name="tableRowClassName">
                <el-table-column prop="id" label="序号"/>
                <el-table-column prop="subjectName" label="学科名称"/>
                <el-table-column prop="submitTime" #empty="" label="添加时间"/>
                <el-table-column prop="submitter" empty-text="" label="操作人员"/>
                <el-table-column label="操作">
                    <template style="display: block" #default="scope">
                        <el-button size="small" type="success"
                                   @click="editSubject(scope.row.subjectId)">修改名称
                        </el-button>
                        <el-button size="small" type="danger"
                                   @click="deleteSubject(scope.row.subjectId)">删除学科
                        </el-button>
                    </template>
                </el-table-column>
                <template v-slot:empty>
                    <el-empty description="暂无数据"></el-empty>
                </template>
            </el-table>
        </div>
        <bottomView></bottomView>
    </div>
</template>
<script>
    import addEditSubjectView from '../../components/schedule/addEditSubject';
    import {ElConfigProvider, ElMessageBox, ElMessage} from "element-plus";
    import zhCn from "element-plus/lib/locale/lang/zh-cn";
    import {httpService} from "@/utils/httpService";
    import bottomView from "@/components/bottom.vue";

    export default {
        name: "subjectListView",
        data() {
            return {
                type: 0,
                title: "",
                list: [],
                form: {
                    subjectName: "",
                    subjectId:""
                },
            };
        },
        components: {
            addEditSubjectView,
            ElConfigProvider,
            ElMessageBox,
            bottomView,
            ElMessage
        },
        setup() {
            return {
                locale: zhCn,
            };
        },
        mounted() {
            this.getSubjectList();
        },
        methods: {
            add() {
                this.$refs.addEditSubjectView.title = '添加学科';
                this.$refs.addEditSubjectView.dialogFormVisible = true
            },
            editSubject(subjectId) {
                this.$refs.addEditSubjectView.title = '修改学科信息';
                this.$refs.addEditSubjectView.dialogFormVisible = true
                this.$refs.addEditSubjectView.getSubjectById(subjectId);
            },
            deleteSubject(subjectId) {
                ElMessageBox.confirm("你确定要删除该学科吗？请确认该学科下面没有老师！", "提醒", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                })
                    .then(() => {
                        httpService("/pythonApi/scheduleApi/deleteSubject", "subjectId=" + subjectId, "post").then(
                            (data) => {
                                if (data.code == 200) {
                                    ElMessage.success(data.message);
                                    this.getSubjectList();
                                } else {
                                    ElMessage.error(data.message);
                                }
                            }
                        );
                    })
                    .catch(() => {
                    });
            },
            getSubjectList() {
                httpService(
                    "/pythonApi/scheduleApi/getSubjectList",
                    {
                        subjectId: this.form.subjectId
                    },
                    "get"
                ).then((data) => {
                    this.list = data.data;
                });
            },
        },
    };
</script>
<style scoped>
.app-table {
    background: #eff3f5;
    padding: 10px;
    width: calc(100vw - 190px);
}

.app-search {
}


.app-body {
    background: white;
    padding: 20px 20px 10px 20px;
    margin-bottom: 10px;
    min-height: calc(100vh - 243px);
}
</style>

